﻿@model OnlineEducation.Data.Entities.TeachingPlan
@{
    ViewData["Title"] = "临时计划";

}
@section Styles{
    <link href="~/assets/libs/dropify/dropify.min.css" rel="stylesheet" type="text/css" />
    <link href="~/assets/libs/flatpickr/flatpickr.min.css" rel="stylesheet" type="text/css" />
    <link href="~/assets/libs/select2/select2.min.css" rel="stylesheet" type="text/css" />
    <style>
        @@media (min-width: 576px) {
            .modal-dialog {
                max-width: 50% !important;
            }
        }
        .select2-container .select2-selection--multiple .select2-selection__choice {
            background-color: #7e57c2;
            border: none;
            color: #fff;
            border-radius: 3px;
            padding: 0 7px;
            margin-top: 7px;
        }
    </style>
}


<!-- Start Content-- >
<div class="container-fluid" >
<!-- start page title -->
<div class="row">
    <div class="col-12">
        <div class="page-title-box">
            <div class="page-title-right">

                <ol class="breadcrumb m-0">
                    <li class="breadcrumb-item"> <a href="javascript: void(0);"> <i class="fa fa-map-marker-alt"> </i> </a> </li>
                    <li class="breadcrumb-item"> <a href="javascript: void(0);"> 临时教学计划</a> </li>
                    <li class="breadcrumb-item active"> 添加</li>
                </ol>
            </div>
            <h4 class="page-title"> 临时教学计划</h4>
        </div>
    </div>
</div>
<!-- end page title -->




<div class="row">
    <div class="col-12">
        <div class="card-box">
            <button onclick="ShowPopup('/TeachingPlan/AddAdhoc/')" type="button" class="btn btn-primary  waves-effect waves-light float-right ladda-button" data-style="expand-left">
                添加临时教学计划
            </button>

            <h4 class="header-title mb-4">临时教学计划列表</h4>

            <div class="table-responsive" data-pattern="priority-columns" data-add-focus-btn="false" data-add-display-all-btn="false" data-add-display-btn="false">
                <table class="table table-small-font  table-striped" id="datatable" style="width:100%">
                    <thead>
                        <tr>
                            <th width="10%" data-priority="1">计划名称</th>

                            <th width="10%" data-priority="1">教师</th>

                            <th width="10%" data-priority="2">开始时间</th>

                            <th width="10%" data-priority="2">课件</th>

                            <th width="8%" data-priority="2">状态</th>

                            <th width="10%" data-priority="2">建立日期</th>

                            <th width="8%" data-priority="1">操作</th>
                        </tr>
                    </thead>
                    <tbody>
                    </tbody>
                </table>
            </div>

        </div><!-- end col -->
    </div>
    <!-- end row -->
</div>
<div id="modalDefault" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true" style="display: none;">
    <div class="modal-dialog">
        <div class="modal-content">

        </div>
    </div>
</div><!-- /.modal -->
@section Scripts{
    @await Html.PartialAsync("_ValidationScriptsPartial")
    <script src="~/assets/libs/moment/moment.min.js"></script>
    <script src="~/assets/libs/dropify/dropify.min.js"></script>
    <script src="~/assets/libs/select2/select2.min.js"></script>
    <script src="~/assets/libs/flatpickr/flatpickr.min.js"></script>
    <script src="~/assets/libs/flatpickr/zh.js"></script>
    <script>


        var table;

        $(function () {

            table = $('#datatable').DataTable({
                "oLanguage": {
                    "sLengthMenu": "每页显示 _MENU_ 条记录",
                    "sZeroRecords": "对不起，没有匹配的数据",
                    "sInfo": "第 _START_ - _END_ 条 / 共 _TOTAL_ 条数据",
                    "sInfoEmpty": "没有匹配的数据",
                    "sInfoFiltered": "(数据表中共 _MAX_ 条记录)",
                    "sProcessing": "正在加载中...",
                    "sSearch": "全文搜索：",
                    "oPaginate": {
                        "sFirst": "第一页",
                        "sPrevious": " 上一页 ",
                        "sNext": " 下一页 ",
                        "sLast": " 最后一页 "
                    }
                },
                language: {
                    paginate:
                        { previous: "<i class='mdi mdi-chevron-left'>", next: "<i class='mdi mdi-chevron-right'>" }
                },
                drawCallback: function () { $(".dataTables_paginate > .pagination").addClass("pagination-rounded"); $('.table-responsive').responsiveTable('update'); },

                "responsive": true,
                "lengthChange": false,
                "searching": true,
                "order": [[5, 'desc']],
                "aoColumnDefs": [{ "bSortable": false, "aTargets": [1, 2, 3, 4, 0] }],
                "serverSide": true,

                ajax: {
                    url: '/TeachingPlan/GetAllAdhocTeachingPlan',
                    type: 'POST',
                    async: true,
                    data: function (data) {

                        return {
                            param: data
                        };
                    }
                },

                columns: [
                    {
                        title: "计划名称",
                        data: "Name",
                        name: "Name",

                    },
                    {
                        title: "教师",
                        data: "TeacherId",
                        name: "TeacherId",
                        render: function (data, type, row) {
                            return row["Teacher"].FullName;
                        }

                    },
                    {
                        title: "开始时间",
                        data: "BeginTime",
                        name: "BeginTime",
                        render: function (data, type, row) {
                            return window.moment(data).format("YYYY-MM-DD HH:mm:ss");
                        }
                    },
                    {
                        title: "课件",
                        data: "MaterialURLs",
                        name: "MaterialURLs",
                        render: function (data, type, row) {
                            return "<a target='_blank' href='" + data + "'>打开课件</a>";
                        }
                    },
                    {
                        title: "状态",
                        data: "Status",
                        name: "Status",
                        render: function (data, type, row) {
                            //debugger;
                            if (data == 0) {
                                return "<span class='badge>未开始</span>";
                            }
                            else if (data == 1) {
                                return "<span class='badge>进行中</span>";
                            }
                            else {
                                return "<span class='badge>完成</span>";
                            }
                            return "<span class='badge>未开始</span>";

                        }
                    },
                    {
                        title: "建立日期",
                        data: "CreatedTime",
                        name: "CreatedTime",
                        render: function (data, type, row) {
                            return window.moment(data).format("YYYY-MM-DD HH:mm:ss");
                        }
                    },
                    {
                        title: "操作",
                        data: null,
                        name: "",
                        render: function (data, type, row) {

                            var html = "<div class='btn-group dropdown'>" +
                                "<a href='javascript: void(0);' class='table-action-btn dropdown-toggle arrow-none btn btn-outline-secondary waves-effect btn-sm' data-toggle='dropdown' aria-expanded='false'><i class='ti-menu'></i></a>" +
                                "<div class='dropdown-menu dropdown-menu-left'>";

                            html = html + "<a class='dropdown-item' href='#' onclick='Remove(\"" + row["Id"] + "\")'><i class='mdi mdi-delete-forever mr-2 text-muted font-18 vertical-middle'></i>删除</a></div></div>";

                            return html;

                        }
                    }

                ]


            });
        });


        function ShowPopup(url) {
            var modalId = 'modalDefault';
            var modalPlaceholder = $('#' + modalId + ' .modal-dialog .modal-content');  
            $.get(url)
                .done(function (response) {
                    modalPlaceholder.html(response);
                    popup = $('#' + modalId + '').modal({
                        keyboard: false,
                        backdrop: 'static',
                    });
                });
        }


        function SubmitForm(form, url) {
            $(form).removeData('validator');
            $(form).removeData('unobtrusiveValidation');
            $.validator.unobtrusive.parse(form);
            if ($(form).valid()) {
                //var data = $(form).serializeJSON();
                //data = JSON.stringify(data);
                var data = new FormData(form);
                $.ajax({
                    type: 'POST',
                    url: url,
                    data: data,
                    contentType: false,
                    processData: false,
                    success: function (data) {
                        if (data.success) {
                            popup.modal('hide');
                            ShowMessage(data.message);
                            table.draw();

                        } else {
                            ShowMessageError(data.message);
                        }
                    }
                });

            }
            return false;
        }

        function Remove(id) {


            Swal.fire({
                title: "删除",
                text: "确定删除?",
                type: "warning",
                showCancelButton: true,
                confirmButtonColor: "#dd4b39",
                confirmButtonText: "是的，删除!",
                cancelButtonText: "取消",
                icon: "warning",
                buttons: true,
                dangerMode: true,

            }).then(function (willdelete) {
                console.log(willdelete);
                if (!willdelete.value) return;
                $.ajax({
                    type: 'POST',
                    url: '/TeachingPlan/Delete/' + id,
                    success: function (data) {
                        if (data.success) {
                            ShowMessage(data.message);
                            table.draw();
                        } else {
                            ShowMessageError(data.message);
                        }
                    }
                });
            });


        }

                //function UpdateStatus(id) {

                //    $.ajax({
                //        type: 'POST',
                //        url: '/TeachingPlan/ChangeStatus/' + id,
                //        success: function (data) {
                //            if (data.success) {
                //                ShowMessage(data.message);
                //                setTimeout(function () {
                //                    window.location.href = "/TeachingPlan/Index";
                //                }, 2000);
                //            } else {
                //                ShowMessageError(data.message);
                //            }
                //        }
                //    });



                //}
    </script>
}
